<template lang="html">
  <div class="priec_main">
    <ul class="priec_box">
      <li class="yue_box">
        <h2>{{PriecMain.yue}}<span>元</span></h2>
        <p>可用余额</p>
      </li>
      <li class="jifan_box">
        <h2>{{PriecMain.jifen}}<span>分</span></h2>
        <p>可用积分</p>
      </li>
      <li>
        <router-link to="/gerenwallet">我的钱包<i></i></router-link>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  props:['PriecMain'],
  data () {
    return {}
  },
  components:{

  }
}
</script>

<style scoped lang="less">
@import '../../../assets/less/index.less';
.priec_main {
  width: 100vw;
  .priec_box{
    width: 100%;
    overflow: hidden;
    zoom:1;
    border-bottom: solid 1vw @color8;
    color: @color7;
    li{
      float: left;
      width: 33.333%;
      h2{
        width: 100%;
        line-height: 5vw;
        margin-top: 4vw;
        margin-bottom: 2vw;
        font-size: @h6_font_size;
        span{
          font-size: @h4_font_size;
          color: @color7;
        }
        .font_space(1);
      }
      p{
        line-height: 4vw;
        font-size: @h3_font_size;
      }
      a{
        line-height: 18.66vw;
        display: inline-block;
        color: @color7;
        font-size: @h1_font_size;
        i{
          display: inline-block;
          .icon-More();
          float: right;
          margin-top: 7.5vw;
        }
      }
    }
    .yue_box h2{
      color: @color;
    }
    .jifan_box h2{
      color: @color5;
    }
  }
}
</style>